<template>
  <div>
    <input type="text" placeholder="这是一个输入框" v-if="isShow" ref="input" />
    <button v-else @click="btn">点击我进行搜索</button>
  </div>
</template>

<script>
// 目标：点击按钮（消失） - 输入框出现并获得焦点
export default {
  data() {
    return {
      isShow: false,
    };
  },
  methods: {
    async btn() {
      this.isShow = true;
      //   this.$nextTick(() => {
      //     this.$refs.input.focus();
      //   });
      await this.$nextTick();
      this.$refs.input.focus();
    },
  },
};
</script>

<style>
</style>